import 'package:english_words/english_words.dart';
import 'package:flutter/material.dart';
import 'package:flutter_easyrefresh/easy_refresh.dart';
import 'package:fluttertoast/fluttertoast.dart';

/*
 * ListView.builder 适合列表比较多的情况
 * 只有当子组件真正显示的时候才会被创建，支持基于Sliver的懒加载模型
 *
 *
 *   @required IndexedWidgetBuilder itemBuilder 返回一个widget,当列表滚到到具体德index位置时，会调用构建器构建列表项
 *   itemCount 列表项的数量  如果为null则为无限列表
 *
 *
 * 添加固定列表项目时使用 Column +  Expanded +
 */
class ListViewBuilderDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("ListViewBuilder"),
      ),
      body: new ListBuilder(),
      //  body: new SeparatedList(),
      // body: new InfiniteListView(),
    );
  }
}

/*
 * 无限加载列表  加载到最后显示没有数据
 */

class InfiniteListView extends StatefulWidget {
  @override
  _InfiniteListViewState createState() => new _InfiniteListViewState();
}

class _InfiniteListViewState extends State<InfiniteListView> {
  static const loadingTag = "##loading##"; //表尾标记
  var _words = <String>[loadingTag];

  //初始化控件
  @override
  void initState() {
    super.initState();
    _retrieveData();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        ListTile(title: Text("商品列表")),
        Expanded(
          child: ListView.separated(
            itemBuilder: (context, index) {
              //如果到了末尾，即最后一个数组是loadingTag
              if (_words[index] == loadingTag) {
                if (_words.length - 1 < 100) {
                  _retrieveData(); //获取数据
                  return Container(
                    padding: const EdgeInsets.all(16.0),
                    alignment: Alignment.center,
                    child: SizedBox(
                      height: 24.0,
                      width: 24.0,
                      child: CircularProgressIndicator(strokeWidth: 2.0),
                    ),
                  );
                } else {
                  return Container(
                    alignment: Alignment.center,
                    padding: EdgeInsets.all(16.0),
                    child: Text(
                      "没有更多了",
                      style: TextStyle(color: Colors.grey),
                    ),
                  );
                }
              }
              //显示列表
              return ListTile(
                title: Text(_words[index]),
                onTap: () {
                  Fluttertoast.showToast(
                    msg: _words[index], toastLength: Toast.LENGTH_LONG);
                });
            },
            separatorBuilder: (context, index) => Divider(height: .0),
            itemCount: _words.length))
      ],
    );
  }

  //初始化数据
  void _retrieveData() {
    Future.delayed(Duration(seconds: 2)).then((e) {
      _words.insertAll(_words.length - 1,
        generateWordPairs().take(20).map((e) => e.asPascalCase).toList());
      setState(() {});
    });
  }
}

/*
 * listView.separated: 带分割线的listView
 */
class SeparatedList extends StatefulWidget {
  @override
  _SeparatedList createState() => new _SeparatedList();
}

class _SeparatedList extends State<SeparatedList> {
  @override
  Widget build(BuildContext context) {
    //创建widget分割线
    Widget divider1 = Divider(color: Colors.blue);
    Widget divider2 = Divider(color: Colors.red);
    return ListView.separated(
      itemBuilder: (BuildContext context, int index) {
        return ListTile(title: Text("$index"));
      },
      separatorBuilder: (BuildContext context, int index) {
        return index % 2 == 0 ? divider1 : divider2;
      },
      itemCount: 100);
  }
}

class ListBuilder extends StatefulWidget {
  @override
  _ListBuilder createState() => new _ListBuilder();
}

class _ListBuilder extends State<ListBuilder> {
  @override
  Widget build(BuildContext context) {
    return EasyRefresh(
      child: ListView.builder(
        itemBuilder: (BuildContext context, int index) {
          return ListTile(title: Text("$index"));
        },
        itemCount: 100, //设置item的总数为100
        itemExtent: 50.0, //强制listView的item为50
      ),
      onRefresh: () async {},
      onLoad: () async {});
  }
}
